<template>
  <div>
    <el-tabs v-model="activeName">
      <el-tab-pane
        v-for="(item, index) in tabsList"
        :key="index"
        :label="item.label"
        :name="item.value">
      </el-tab-pane>
      <component
        v-if="!loading"
        class="pd10"
        :is="whickComm[activeName]"
        :key="key"
        :nowRowData="nowData"></component>
    </el-tabs>
    
  </div>
</template>

<script setup lang="ts">
import apiMod from '@/apiMod/index'
import { getAreaObj } from '@/utils/util'
import BaseDetail from './BaseDetail/index.vue'
import ApplyDetail from './ApplyDetail/index.vue'
import ReformDetail from './reformDetail/index.vue'
import AcceptDetail from './acceptDetail/index.vue'
import AccessDetail from './AccessDetail/index.vue'
import SignedDetail from './SignedDetail/index.vue'

const whickComm = {
  BaseDetail,
  ApplyDetail,
  AccessDetail,
  ReformDetail,
  AcceptDetail,
  SignedDetail
}
type Props = {
  nowRowData?: any
}
const props = withDefaults(defineProps<Props>(), {
  nowRowData:{}
})
let key = ref(1)
let nowData:any = reactive({})
const loading = ref(false)
const tabsList = [
  { label: '基础档案', value: 'BaseDetail' },
  { label: '申请档案', value: 'ApplyDetail' },
  { label: '评估档案', value: 'AccessDetail' },
  { label: '签约档案', value: 'SignedDetail' },
  { label: '改造档案', value: 'ReformDetail' },
  { label: '验收档案', value: 'AcceptDetail' }
]
const activeName = ref('BaseDetail')
provide('nowRowData', nowData)
const getInitData = () => {
  apiMod.dpFamilyConstructionArchives_view(props.nowRowData.id).then(res=>{
    // 处理区域
    let areasObj:any = getAreaObj(res.data,'','set')
    let crAreasObj:any = getAreaObj(res.data, 'cr', 'set')
    res.data.areas = areasObj.areaIds
    res.data.areas_name = areasObj.names
    res.data.cr_areas = crAreasObj.areaIds
    res.data.cr_areas_name = crAreasObj.names
    nowData = res.data
    console.log('获取数据', nowData)
    key.value = Math.random()
  })
}
getInitData()
</script>

<style scoped></style>
